playgrounds/nuxt/app/pages/components/chat-message.vue (1)

19-21: Consider adding required props to UChatMessage.

The UChatMessage component requires id, role, and parts props (or the deprecated content). While content is provided, consider using the recommended parts format with proper id and role for a complete example:

♻️ Suggested enhancement

   <Matrix v-slot="props" :attrs="attrs">
-    <UChatMessage content="My message" v-bind="props" />
+    <UChatMessage
+      id="demo-message"
+      role="user"
+      :parts="[{ type: 'text', text: 'My message' }]"
+      v-bind="props"
+    />
   </Matrix>

🤖 Prompt for AI Agents

Verify each finding against the current code and only fix it if needed.

In `@playgrounds/nuxt/app/pages/components/chat-message.vue` around lines 19 - 21,
The UChatMessage usage currently passes only the deprecated content prop; update
the Matrix slot render to provide UChatMessage with the required props: include
a unique id, a role (e.g., "user" or "assistant"), and the parts array (instead
of content) constructed from the slot props; locate the Matrix v-slot and
replace the UChatMessage attributes so it receives id, role and parts (e.g.,
parts: [{ content_type: "text", text: "My message" }]) while still binding
remaining props via v-bind="props".

playgrounds/nuxt/app/pages/components/chat-message.vue (1)

19-21: Consider showcasing the new header slot in this playground.

This page already demonstrates the new color behavior well; adding a simple #header example would make the slot addition easier to discover interactively.

🤖 Prompt for AI Agents

Verify each finding against the current code and only fix it if needed.

In `@playgrounds/nuxt/app/pages/components/chat-message.vue` around lines 19 - 21,
Add a small example of the new header slot to the playground by updating the
UChatMessage usage inside the Matrix v-slot block: keep the existing props and
parts but add a header slot (e.g., a <template `#header`> or v-slot:header on
UChatMessage) that renders simple header content like a title, role label or
timestamp so users can interactively see the new header slot behavior alongside
the existing color demo; modify the Matrix v-slot="props" / UChatMessage id="1"
block to include that header slot example.

test/components/ChatMessage.spec.ts (1)

31-31: ⚡ Quick win

header slot test only checks render, not slot-prop forwarding.

The new with header slot case verifies the slot renders without error, which is the minimum bar. The PR summary notes the header slot can receive slot props (e.g., files as a fallback). If the slot exposes any props, there is no assertion that confirms they are correctly forwarded — analogous to the existing forwards id, role, parts, metadata and content test for the content slot.

Consider adding a dedicated test that captures the header slot's props and asserts their shape, matching whatever ChatMessage.vue exposes.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@test/components/ChatMessage.spec.ts` at line 31, The 'with header slot' test
only verifies render but doesn't assert that slot props are forwarded; update
the ChatMessage.spec.ts case named 'with header slot' to provide the header slot
as a function that captures the received slotProps into a variable and assert
its shape/values (e.g., that it includes the expected files fallback or whatever
props ChatMessage.vue exposes). Mirror the pattern used in the existing
"forwards id, role, parts, metadata and content" test: render the header slot as
a function, capture slotProps, and add assertions on keys/types/expected values
to confirm proper forwarding from ChatMessage.vue.